<template>
  <view class="search-detail-view">
    <!--  搜索框  -->
    <fixed-search
      :search-name="curSearchName"
      ipt-placeholder="请输入荣誉"
      @arrow-click="goHonourPage"
      @handle-search-icon-click="handleSearch"
    />
    <view class="filter">
      <cell-group
        title="高级筛选"
        :cell-list="cellList"
        @handle-popup-cell-click="getSelectVal"
      />
    </view>
    <view class="top-search">
      <view class="top-search-title">
        <h3>热门搜索</h3>
      </view>
      <view class="top-search-content">
        <text
          class="top-search-content-item"
          v-for="item in topSearchList"
          :key="item.id"
          @tap="handleTopSearchItemClick(item)"
        >
          {{ item.filedName }}
        </text>
      </view>
    </view>
  </view>
</template>
<script setup>
import fixedSearch from "./components/fixed-search.vue";
import cellGroup from "./components/cell-group.vue";
import { onLoad } from "@dcloudio/uni-app";
import { inject, ref, defineProps, nextTick } from "vue";
import {
  generateRandomNumId,
  getUrlParamsInH5,
  getUrlParamsInWeixin,
} from "@/utils/utils";
import {
  getConfigEnterpriseFieldsApi,
  getHonourYearsListApi,
  getTopSearchApi,
} from "@/api/honour/search";
import { customNav } from "@/utils/customNav";

const props = defineProps({
  searchType: {
    type: String,
    default: "企业荣誉",
  },
});
const cellList = ref([]);

/**
 * 监听筛选单元格点击事件
 * @param val
 */
const getSelectVal = (val) => {
  const { labelName, selectedItem } = val;
  for (const cell of cellList.value) {
    if (cell.filedName === labelName) {
      for (const child of cell.children) {
        if (child.filedName === selectedItem.filedName) {
          cell.value = selectedItem.filedName;
          child.checked = true;
          return;
        }
      }
    }
  }
};

const curSearchType = ref(0);
const curSearchName = ref("");
const searchTypeDict = {
  企业荣誉: 0,
  集体荣誉: 1,
  个人荣誉: 2,
};
/**
 * 获取企业高级筛选内容
 * @returns {Promise<void>}
 */
const getConfigEnterpriseFields = async () => {
  const params = {
    type: searchTypeDict[curSearchType.value] || searchTypeDict["企业荣誉"],
  };
  const res = await getConfigEnterpriseFieldsApi(params);
  const { code, data } = res;
  if (code === 200) {
    data.forEach((item) => {
      item.children.unshift({
        id: generateRandomNumId(19),
        filedName: "不限",
      });
    });
    await getHonourYearsList(data);
  }
};
/**
 * 获取荣誉年份数据
 * @param config
 * @returns {Promise<void>}
 */
const getHonourYearsList = async (config) => {
  const res = await getConfigEnterpriseFieldsApi({
    type:"企业荣誉年份"
  });
  // const res = await getHonourYearsListApi();
  const { code, data } = res;
  if (code === 200) {
    // const { yearList } = data || {};
    // const treatedYearList = yearList.map((item) => {
    //   return {
    //     id: new Date().getTime() + item,
    //     filedName: item,
    //   };
    // });
    console.log("data[0].children",data[0].children);
    
    const yearList = data[0].children;
    const treatedYearList = yearList.map((item) => {
      return {
        id: item.id,
        filedName: item.filedName,
      };
    });
    console.log("treatedYearList",treatedYearList);
    
    config.push({
      id: new Date().getTime(),
      filedName: "荣誉年份",
      children: [
        {
          id: generateRandomNumId(19),
          filedName: "不限",
        },
      ].concat(treatedYearList),
    });

    Array.isArray(config) &&
      config.forEach((item) => {
        item.cellType = "select";
        item.value = "不限";
      });
    cellList.value = config;
  }
};

// 热搜榜单
const topSearchList = ref([]);
const getTopSearchList = async () => {
  const res = await getTopSearchApi("3");
  const { code, data } = res;
  if (code === 200) {
    topSearchList.value = data;
  }
};

/**
 * 处理搜索数据
 * @param searchIptVal
 */
const handleSearch = (searchIptVal) => {
  // 荣誉等级
  const honourLevelData = cellList.value.find(
    (cell) => cell.filedName === "荣誉等级"
  );
  let honourLevelVal = honourLevelData?.children.find(
    (child) => child.checked
  )?.filedName;
  honourLevelVal = honourLevelVal === "不限" ? "" : honourLevelVal;
  // 荣誉区域
  const honourArea = cellList.value.find(
    (cell) => cell.filedName === "荣誉区域"
  );
  let honourAreaVal = honourArea?.children.find(
    (child) => child.checked
  )?.filedName;
  honourAreaVal = honourAreaVal === "不限" ? "" : honourAreaVal;

  // 荣誉年份
  const honourYear = cellList.value.find(
    (cell) => cell.filedName === "荣誉年份"
  );
  let honourYearVal = honourYear?.children.find(
    (child) => child.checked
  )?.filedName;
  honourYearVal = honourYearVal === "不限" ? "" : honourYearVal;

  //    honorNameList: searchIptVal,
  const params = {
    enterpriseName: searchIptVal,
    yearList: honourYearVal ? [honourYearVal] : [],
    grade: honourLevelVal,
    countiesList: honourAreaVal ? [honourAreaVal] : [],
  };
  getEnterPriseList(params);
};

const handleTopSearchItemClick = (item) => {
  nextTick(() => {
    curSearchName.value = item.filedName;
  });
};
const packageHonourPath = inject("packageHonourPath");

const getEnterPriseList = (params) => {
  customNav(
      `${packageHonourPath}/enterprise-list?searchParams=${JSON.stringify(
        params
      )}`
    );
};

const goHonourPage = () => {
  customNav(`${packageHonourPath}/index`);
};

onLoad(() => {
  /* #ifndef MP-WEIXIN */
  curSearchType.value = getUrlParamsInH5()?.searchType;
  curSearchName.value = getUrlParamsInH5()?.searchName;
  /* #endif */

  /* #ifdef MP-WEIXIN */
  curSearchType.value = getUrlParamsInWeixin()?.searchType;
  curSearchName.value = getUrlParamsInWeixin()?.searchName;
  /* #endif */
  console.log("curSearchType.value", curSearchType.value);
  getConfigEnterpriseFields();
  getTopSearchList();
});
</script>
<style scoped lang=less>
.search-detail-view {
  .filter {
    margin-top: 50rpx;
  }

  .top-search {
    padding: 0 40rpx;
    margin-top: 50rpx;

    &-title {
      h3 {
        font-size: 31rpx;
        font-weight: 500;
        color: #272636;
      }
    }

    &-content {
      display: flex;
      flex-wrap: wrap;

      &-item {
        display: inline-block;
        height: 54rpx;
        line-height: 54rpx;
        background-color: #ffffff;
        font-size: 23rpx;
        font-family: "ali";
        text-align: center;
        color: #68696a;
        margin-top: 20rpx;
        margin-right: 20rpx;
        padding: 0 45rpx;
        border-radius: 7rpx;
      }
    }
  }
}
</style>
